<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>使用v-on指令调用自定义方法弹出提示信息对话框</title>
<!--引入Vue库-->
<script src="vue.js"></script>
</head>
<body>	
<div id="main">	
   <!-- `showInfo`是在下面定义的方法名 -->
   <button v-on:click="showInfo">提交</button>
</div>
<script>
  var vm=new Vue({ 
      el: "#main",
      data: {
          message: '用户名不能为空'
        },
      // 在 `methods`中定义方法
      methods: {
        showInfo : function (event) {
            // `this` 在方法里指当前 Vue 实例
            alert('提示信息：' + this.message)
            // `event` 是原生 DOM 事件
            if (event) {
                alert(event.target.tagName)  //显示按钮的标识名称button
              }
            }
          }
      })
  // 也可以使用 JavaScript 直接调用方法
  vm.showInfo() // -> '提示信息：用户名不能为空'
</script>
</body>
</html>
